<template>
    <nav id="nav">
        <div>
            <h1>
                <a href="/" class="logo">王者荣耀</a>
            </h1>
            <ul>
                <li><a href="/">官网首页</a><em>HOME</em></li>
                <li><a href="/yxjs">游戏介绍</a><em>DATA</em></li>
                <li><a href="/yxgl">游戏攻略</a><em>STRATEGY</em></li>
                <li><a href="/wzyyt">王者音乐听</a><em>MUSIC</em></li>
                <li><a href="/yxbz">游戏壁纸</a><em>WALLPAPER</em></li>
                <li><a href="/djhj">对局环境</a><em>CONFRONTATION</em></li>
            </ul>
        </div>
    </nav>
    <header id="header" style="background-color:rgba(0,0,0,.8)">
        <div class="zynr">
            <div class="yybt1">
                <img src="../assets/img/wzyyt/yxysd.png" width="680">
            </div>
            <ul class="yybt2">
                <li><a href=""><img class="img_top" src="../assets/img/wzyyt/yxyybtt1.jpg" width="475" height="151"></a>
                </li>
                <li><a href=""><img class="img_top" src="../assets/img/wzyyt/yxyybtt2.jpg" width="475" height="151"></a>
                </li>
            </ul>
            <div class="yybt3">
                <ul>
                    <li>
                        <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
                        <img class="img_center" src="../assets/img/wzyyt/yyfm1.jpg" width="102" height="102"
                             style="float: left;margin-top:-102px;">
                    </li>
                    <li>
                        <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
                        <img class="img_center" src="../assets/img/wzyyt/yyfm2.jpg" width="102" height="102"
                             style="float: left;margin-top:-102px;">
                    </li>
                    <li>
                        <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
                        <img class="img_center" src="../assets/img/wzyyt/yyfm3.jpg" width="102" height="102"
                             style="float: left;margin-top:-102px;">
                    </li>
                    <li>
                        <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
                        <img class="img_center" src="../assets/img/wzyyt/yyfm4.jpg" width="102" height="102"
                             style="float: left;margin-top:-102px;">
                    </li>
                    <li>
                        <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
                        <img class="img_center" src="../assets/img/wzyyt/yyfm5.jpg" width="102" height="102"
                             style="float: left;margin-top:-102px;">
                    </li>
                    <li>
                        <img src="../assets/img/wzyyt/yyfmbj.png" width="132" height="102" style="float: left;">
                        <img class="img_center" src="../assets/img/wzyyt/yyfm6.jpg" width="102" height="102"
                             style="float: left;margin-top:-102px;">
                    </li>
                </ul>
            </div>
            <div class="yybt4">
                <div class="yynr1">
                    <img src="../assets/img/wzyyt/yyfmbj.png" width="360" height="360"
                         style="float: left;padding-left: 220px;">
                    <img class="img_bottom" src="../assets/img/wzyyt/yyfm6.jpg" width="372" height="372"
                         style="float: left;border-radius: 10px;margin-top: -372px;">
                </div>
                <div class="yynr2">
                    <p style="margin-bottom: 20px;opacity: 0.4;">曲目列表</p>
                    <p>王者冰刃</p>
                    <p>永远的长安城</p>
                    <p>王者雪魄</p>
                </div>

            </div>

        </div>
    </header>

    <footer id="footer" style=" position: relative;top: -100px;width:auto">
        <audio src="/audio/王者冰刃.mp3" autoplay controls loop style="width: 90%;margin-left: 60px;">
            对不起，你的浏览器不支持audio标签，请更换浏览器试试！
        </audio>
    </footer>

</template>
<script setup>

</script>


<style scoped>
@import url(../assets/css/wztb.css);
@import url(../assets/css/ys4.css);
</style>